<template>
  <div class="privacy">
    <h2>隐私设置</h2>
    <el-row class="hei-ctrl">
      <el-col :span="12">
        <el-switch v-model="saveVisible" @change="handleSave"/>公开我的收藏
      </el-col>
      <el-col :span="12">
        <el-switch v-model="likeVisible" @change="handleLike"/>公开最近点赞的视频
      </el-col>
    </el-row>
    <el-row class="hei-ctrl">
      <el-col :span="12">
        <el-switch v-model="careVisible" @change="handleCare"/>公开我的关注列表
      </el-col>
      <el-col :span="12">
        <el-switch v-model="fansVisible" @change="handleFans"/>公开我的粉丝列表
      </el-col>
    </el-row>
    <el-row class="hei-ctrl">
      <el-col :span="12">
        <el-switch v-model="infoVisible" @change="handleInfo"/>公开我的生日、个人标签
      </el-col>
      <el-col :span="12">
        <el-switch v-model="schoolVisible" @change="handleSchool"/>公开学校信息
      </el-col>
    </el-row>
  </div>
</template>
<script setup>
import {onMounted, ref} from "vue";
import {
  getPrivacy,
  switchCareVisible,
  switchFansVisible,
  switchInfoVisible,
  switchLikeVisible,
  switchSaveVisible,
  switchSchoolVisible
} from "@/api/api.js";
const saveVisible = ref(false)
const likeVisible = ref(false)
const careVisible = ref(false)
const fansVisible = ref(false)
const infoVisible = ref(false)
const schoolVisible = ref(false)

onMounted( async  ()=>{
  currentUserId = localStorage.getItem("userId")
  const res = await getPrivacy();
  console.log(res)
  saveVisible.value = res.data.saveVisible === 1
  likeVisible.value = res.data.likeVisible === 1
  careVisible.value = res.data.careVisible ===1
  fansVisible.value = res.data.fansVisible ===1
  infoVisible.value = res.data.infoVisible ===1
  schoolVisible.value = res.data.schoolVisible ===1
})
let currentUserId = 0
const handleSave = async (val) => {
  console.log(val)
  const res = await switchSaveVisible(val)
}
const handleLike = async (val) => {
  console.log(val)
  const res = await switchLikeVisible(val)
}
const handleCare = async (val) => {
  console.log(val)
  const res = await switchCareVisible(val)
}
const handleFans = async (val) => {
  console.log(val)
  const res = await switchFansVisible(val)
}
const handleInfo = async (val) => {
  console.log(val)
  const res = await switchInfoVisible(val)
}
const handleSchool = async (val) => {
  console.log(val)
  const res = await switchSchoolVisible(val)
}

</script>
<style lang="scss" scoped>
.privacy{
  .hei-ctrl{
    margin: 20px 0;
  }
}
</style>